/**
 * constructor of class popUpPrice which is used to popup the price details.
 * @param array priceList an array with object inside
 */
/*
object : {
    'title' : space title,
    'image' : a URL to the image source,
    'link' : link page URL when click the image,
    'type' : space type,
    'theme' : space theme,
    'categoryPath' : space category,
    'categoryPathShort' : a short description of category,
    'siteRating' : website rating,
    'urlDisplay' : the website URL,
    'availableDate' : available date,
    'lastImpression' : optional, only for login user,
    'demographicNumber' : country number,
    'demographicDisplay' : a array, contain the top three country name and percentage,
    'siteDescription' : a short description of the website,
    'spaceDescription' : a short description of the ad space,
    'spaceTags' : the tag of the space
}
*/

/**
 * Displays a div to show adspace preview.
 * @param Array spaceList contain all the spaces data
 */
var PopUpAdspace = function () {
    this.previewBlock = document.getElementById('spacePreviewBlock');
    this.errorBlock = document.getElementById('errorBlock');
    this.title = document.getElementById('title');
    this.availabledate = document.getElementById('availabledate');
    this.imageLink = document.getElementById('imageLink');
    this.categoryPath = document.getElementById('categoryPath');
    this.lastImpressionBlock = document.getElementById('lastImpressionBlock');
    this.lastImpression = document.getElementById('lastImpression');
    this.themeBlock = document.getElementById('themeBlock');
    this.theme = document.getElementById('theme');
    this.topCountry = document.getElementById('topCountry');
    this.siteRating = document.getElementById('siteRating');
    this.urlDisplay = document.getElementById('urlDisplay');
    this.siteDescription = document.getElementById('siteDescription');
    this.spaceDescription = document.getElementById('spaceDescription');
    this.spaceTags = document.getElementById('spaceTags');
    this.adjustion = null;
    this.spaceList = null;
    this.isDisplay = false;
};

/**
 * Set the data of local variable spaceList 
 * @param {Array} spaceList
 * @return void
 */
PopUpAdspace.prototype.setData = function(spaceList) {
        this.spaceList = spaceList;
};

/**
 * Shows the space preview
 * @param int id The space id.
 * @return void
 */
PopUpAdspace.prototype.show = function(id) {
    try {
        var space = this.spaceList[id];
        if (null == space) {
            this.errorBlock.style.display = 'block';
        }
        else {
            this.title.innerHTML = space.title;
            if (space.lastImpression) {
                this.lastImpressionBlock.style.display = 'block';

                if ('' != space.lastImpression) {
                    this.lastImpression.style.display = 'none';
                    this.lastImpression.nextSibling.style.display = 'inline'
                    this.lastImpression.nextSibling.innerHTML = space.lastImpression;
                }
            }
            this.imageLink.href = space.link;
            this.imageLink.childNodes[0].src = space.image;
            if ('GTB' == space.type) {
                this.themeBlock.style.display = 'block';
                this.theme.innerHTML = space.theme;
            }
            if (0 != space.demographicNumber) {
                this.topCountry.style.display = 'none';
                for (var i = 0; i < space.demographicDisplay.length; i++) {
                    var top = document.getElementById('topCountry' + (i + 1));
                    top.innerHTML = (i + 1) + '. ' + space.demographicDisplay[i][0] + ' ( ' + space.demographicDisplay[i][1] + '% )';
                }
            }
            this.availabledate.innerHTML = space.availableDate;
            this.categoryPath.title = space.categoryPath;
            this.categoryPath.innerHTML = space.categoryPathShort;
            this.siteRating.innerHTML = space.siteRating;
            this.urlDisplay.innerHTML = space.urlDisplay;
            this.siteDescription.innerHTML = space.siteDescription;
            this.spaceDescription.innerHTML = space.spaceDescription;
            this.spaceTags.innerHTML = space.spaceTags;
            this.previewBlock.style.display = 'block';
        }
        this.isDisplay = true;
    }
    catch (exception) {
        //do nothing here
    }
};

/**
 * Hides the preview and restore the data in the preview popup.
 * @return void
 */
PopUpAdspace.prototype.hide = function() {    
    if ('block' == this.errorBlock.style.display) {
        this.errorBlock.style.display = 'none';
    }
    else {
        this.lastImpressionBlock.style.display = 'none';
        this.lastImpression.style.display = 'block';
        this.lastImpression.nextSibling.style.display = 'none';
        this.lastImpression.nextSibling.innerHTML = '';
        this.themeBlock.style.display = 'none';
        this.theme.innerHTML = '';
        this.topCountry.style.display = 'block';
        for (var i = 0; i < 3; i++) {
            var top = document.getElementById('topCountry' + (i + 1));
            top.innerHTML = '';
        }
        this.title.innerHTML = '';
        this.availabledate.innerHTML = '';
        this.imageLink.href = '';
        this.imageLink.childNodes[0].src = '';
        this.categoryPath.innerHTML = '';
        this.theme.innerHTML = '';
        this.siteRating.innerHTML = '';
        this.urlDisplay.innerHTML = '';
        this.siteDescription.innerHTML = '';
        this.spaceDescription.innerHTML = '';
        this.spaceTags.innerHTML = '';
        this.previewBlock.style.display = 'none';
    }
    this.isDisplay = false;
}

/**
 * Sets the popup size
 * @param int width The width for the iframe.
 * @param int height The width for the iframe.
 * @return void
 */
PopUpAdspace.prototype.changeSize = function(width, height) {
    this.previewBlock.style.width = parseInt(width) + 'px';
    this.previewBlock.style.height = parseInt(height) + 'px';
};

/**
 * Sets the popup position.
 * @param int top The top coordinate for the iframe.
 * @param int left The left coordinate for the iframe.
 * @return void
 */
PopUpAdspace.prototype.changePosition = function(top, left) {
    if ('block' == this.errorBlock.style.display) {
        this.errorBlock.style.top = parseInt(top) + 'px';
        this.errorBlock.style.left = parseInt(left) + 'px';
    }
    else {
        this.previewBlock.style.top = parseInt(top) + 'px';
        this.previewBlock.style.left = parseInt(left) + 'px';
    }
};

/**
 * Adjust popup iframe position to locate within browser window.
 * @param array position The posotion of the source element
 * @param object element the source element
 */
PopUpAdspace.prototype.adjustPopUpPosition = function(position, element) {
    this.setSrcElement(element);
	var frameWidth = this.previewBlock.offsetWidth;
    var frameHeight = this.previewBlock.offsetHeight;
    var eLeft = position.left;
    var eTop = position.top;
    var bodyHeight = document.documentElement.clientHeight;
    var bodyWidth = document.documentElement.clientWidth;
    var scrollBarTop = document.documentElement.scrollTop;
    var scrollBarLeft = document.documentElement.scrollLeft;
    var browserHeight = bodyHeight + scrollBarTop;
    var browserWidth = bodyWidth + scrollBarLeft;
    var adjustionHeight = this.adjustion.height;
    var adjustionWidth = this.adjustion.width;
    if ((browserWidth < (eLeft + frameWidth)) && (eLeft - frameWidth - adjustionWidth) > 0) { //adjust herizontal position
        eLeft = eLeft - this.srcElement.offsetWidth - frameWidth;
        eLeft = Math.max(scrollBarLeft, eLeft);
    }

    if (browserHeight < (eTop + frameHeight)) { //adjust vertical position
        if ((eTop - scrollBarTop - adjustionHeight) > frameHeight) { //enough space above HREF
            adjustionHeight = (adjustionHeight > 40) ? adjustionHeight/2 : adjustionHeight;
            eTop = eTop - frameHeight - adjustionHeight;
        }
        else if (frameHeight > bodyHeight) { //browser window is shorter than the pop-up layer
            eTop = scrollBarTop;
        }
        else {
            eTop = bodyHeight - frameHeight + scrollBarTop;
        }
    }

    var marginTop = position.top - eTop;
    var marginLeft = position.left - eLeft;
    if ((marginTop > 0) && (marginTop < frameHeight) && (marginLeft > 0) && (marginLeft < frameWidth)) {
        this.redirectSrcElement();
    }
    this.changePosition(eTop, eLeft);
};

/**
 * Override onmouseout function when popup layer covers its parent element.
 */
PopUpAdspace.prototype.redirectSrcElement = function() {
    this.backupOnmouseout = this.srcElement.onmouseout;
    this.srcElement.onmouseout = null;
    var oldFrameOnmouseout = this.frameElement.contentWindow.document.onmouseout;
    var obj = this;
    this.frameElement.contentWindow.document.onmouseout = function() {
        if ('function' == typeof(oldFrameOnmouseout)) {
            oldFrameOnmouseout();
        }
        obj.srcElement.onmouseout = obj.backupOnmouseout;
        if ('function' == typeof(obj.srcElement.onmouseout)) {
            obj.srcElement.onmouseout();
        }
        obj.frameElement.contentWindow.document.onmouseout = oldFrameOnmouseout;
    }
};

/**
 * Gets offset of pop-ups when adjustion is needed.
 * @param element
*/
PopUpAdspace.prototype.getAdjustion = function(element) {
    var adjustion = {'width' : 10, 'height' : 10};
    while (element != null && 'TD' != element.nodeName) {
        element = element.parentNode;
    }
    if (element != null) {
        adjustion.width = element.offsetWidth;
        adjustion.height = element.offsetHeight;
    }
    return adjustion;
}

/**
 * Sets offset of pop-ups when adjustion is needed.
 * @param adjustWidth
 * @param adjustHeight
*/
PopUpAdspace.prototype.setAdjustion = function(adjustWidth, adjustHeight) {
    var _adjustion = {'width' : 0, 'height' : 0};

    _adjustion.width = adjustWidth;
    _adjustion.height = adjustHeight;
    this.adjustion = _adjustion;
}

/**
 * Sets the src element
 * @param element
 */
PopUpAdspace.prototype.setSrcElement = function(element) {
    if ('A' != element.nodeName) {
        element = element.parentNode;
    }
    this.srcElement = element;
    this.adjustion = this.getAdjustion(element);
};